import React from 'react';

/*
  学习目标：React中的更新机制
    1. 父组件更新，或导致所有的后代组件更新
    2. 组件更新，不会影响兄弟组件更新 
*/
export default class App extends React.Component {
  state = {
    count: 0,
  };

  handleClick = () => {
    this.setState({ count: this.state.count + 1 });
  };

  render() {
    return (
      <div>
        <h1>数量： {this.state.count}</h1>
        <button onClick={this.handleClick}>点我修改数量</button>
        <Footer></Footer>
      </div>
    );
  }
}

// 导致组件更新的方式：1.setState  2.props更新
class Footer extends React.Component {
  render() {
    console.log('render被执行了  ----->  ');
    return <div>我是Footer</div>;
  }
}
